
import React, { Component } from 'react';
import {
  StyleSheet,
  View,
  Text,
  FlatList,
  Image,
  TouchableNativeFeedback,
  TouchableHighlight,
  ActivityIndicator,
} from 'react-native';

import Orderitem from '../components/orderitem';
import DatePicker from 'react-native-datepicker';
import parseDate from '../commons/parseDate'

var styles=StyleSheet.create({
   icon:{
     width:30,
     height:30
   },
   ordertype:{
     width:200,
     height:50,
     flexDirection:'row',
     justifyContent:'space-around',
     alignItems:'center'
   },
   heigh:{
     flexDirection:'row',
     justifyContent:'center',
     alignItems:'center',
     height:50,
     width:80,
     borderRadius:5,
     backgroundColor:'#db2244'
   },
   low:{
     flexDirection:'row',
     justifyContent:'center',
     alignItems:'center',
     height:50,
     width:80,
     borderRadius:5
   },
   chosetop:{
     height:50,
     width:'100%',
     backgroundColor:'white',
     width:'100%',
     borderBottomWidth:1,
     borderColor:'#ddd',
     height:50,
     flexDirection:'row',
      justifyContent:'space-around',
       alignItems:'center',
       backgroundColor:'white',
       shadowColor:"black",
       shadowOpacity:0.5,
       shadowRadius:2,
       shadowOffset:{h:10,w:10}
   }
})



export default class MyMovies extends Component {
  static navigationOptions = {
    title: '订单管理',
    headerTitleStyle: {
        alignSelf:'center'
      },
      headerStyle:{
        height:45
      },
    tabBarLabel: '订单管理',
    tabBarPosition:'bottom',
    tabBarIcon: () => (
      <Image
        source={require('../img/document.png')}
        style={styles.icon}
      />
    ),
  };
  state={
    movies:[
      {
        title:'1'
      },
      {
        title:'2'
      },
      {
        title:'3'
      }
    ],
    datebegin:'2018-1-12',
    today:'20199-1-12',
    haveorder:false,
    orderdata:[],
    showedfood:[],
    showtype:1
  }
  _onPress=(item)=>{
    this.props.navigation.navigate("Orderin",{data:item,id:item.id,reload:()=>{this.fetchData()}})
  }

  getsmalldate=function(){
        var date = new Date();
      this.year = date.getFullYear();
      this.month = date.getMonth() + 1;
      this.date = date.getDate();
      this.day = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六")[date.getDay()];
      var currentTime =this.year + "-" + this.month + "-" + this.date;
      return currentTime
      }	


      changetype=function(data){
        this.setState({
          showtype:data
        })
        this.showfood(data)
      }

      showfood=function(data){
        var food=[]
        if(data){
          this.state.orderdata.forEach(function(data){
            if(data.paymentStatus==2||(data.paymentStatus==6&&(new Date().getTime()-parseDate(data.createDate).getTime())<86400000)){
              food.push(data)
            }
          })
        }
        else{
          this.state.orderdata.forEach(function(data){
            if(data.paymentStatus!=1&&(data.paymentStatus!=2&&(data.paymentStatus!=6||(data.paymentStatus==6&&(new Date().getTime()-parseDate(data.createDate).getTime())>86400000)))){
              food.push(data)
            }
          })
        }
        
      
        this.setState({
          showedfood:food
        })
      }


    fetchData=async function(){
        let response = await fetch(global.mainurl+"bossHelper/getOrderData?sellerid="+global.sellerid+"&userid="+global.userdata.id+"&token="+global.token+"&&pageNo=1&&pageSize=100&date="+this.state.datebegin);
         console.log(response)
         var result=await response.json()
         console.log(result)
         if(result.data=="暂无订单"){
           this.setState({
           haveorder:false
            })
         }
         else{
         this.setState({
           orderdata:result.data,
           haveorder:true
         })
        

           this.showfood(this.state.showtype)

         
         }
      }

  async componentWillMount(){
        this.setState({
          datebegin:"2018-1-10"
        })
        this.fetchData()
      }

  render() {
    const { movies} = this.state;
    return (
      <View>
        <View style={styles.chosetop}>
      <DatePicker
        style={{width: 130}}
        date={this.state.datebegin}
        mode="date"
        placeholder="select date"
        format="YYYY-MM-DD"
        minDate="2016-05-01"
        maxDate={this.state.today}
        confirmBtnText="Confirm"
        cancelBtnText="Cancel"
        customStyles={{
          dateIcon: {
            position: 'absolute',
            left: 0,
            top: 4,
            marginLeft: 0
          },
          dateInput: {
            marginLeft: 36,
            borderRadius:8
          }
        }}
        onDateChange={(date) => {this.setState({datebegin: date});var _this=this;setTimeout(function(){_this.fetchData()})}}
      />
      <View style={styles.ordertype}>
      <TouchableNativeFeedback
      onPress={()=>{this.changetype(0)}}
      >
      <View style={!this.state.showtype?styles.heigh:styles.low}>
      <Text>异常订单</Text>
      </View>
      </TouchableNativeFeedback>
      <TouchableNativeFeedback
      onPress={()=>{this.changetype(1)}}
      >
      <View  style={this.state.showtype?styles.heigh:styles.low}>
      <Text>正常订单</Text>
      </View>
      </TouchableNativeFeedback>
      </View>
        </View>
        <View style={{paddingBottom:100}}>
        {
          this.state.haveorder&&this.state.showedfood.length>0?
          
            
            
            <FlatList
              numColumns={1}
              keyExtractor={(item,index) => index}
              data={this.state.showedfood}
              ItemSeparatorComponent={()=>{
                return(
                  <View style={{height:1,backgroundColor:'rgba(150,150,150,0.1)'}}/>
                )
                }
              }
              renderItem={({item}) =>{
                return (
                <Orderitem
                title={'1232132132'}
                 info={item}
                 onPress={() => this._onPress(item)}
                  />
                   )
                   }
                   }
            />
            
            
            
              :
              <Text>暂无订单</Text>
            }
            </View>
      </View>
    );
  }
}
